<template>
	<div class="page testPage">
		<div class="scroll-view">
			<customHeader middleTitle="测试app接口页面"
			              @leftCallBack="handleBack" />
			<div class="page-body">
				<input type="text"
				       :value="localUrl">
				<mt-button type="default"
				           @click="handleOpenLocalUrl">pushWindow打开本地url</mt-button>
				<mt-button type="default"
				           @click="handleOpenLocalUrlTitle">pushWindow打开本地url带title</mt-button>
				<input type="text"
				       :value="serverUrl">
				<mt-button type="default"
				           @click="handleOpenServerUrl">pushWindow打开远url</mt-button>
				<mt-button type="default"
				           @click="handleOpenServerUrlTitle">pushWindow打开远url带title</mt-button>
				<mt-button type="default"
				           @click="handleTestVoiceBroadcast">测试语音播报</mt-button>
				<img :src="imgUrl"
				     alt="">
				<mt-button type="default"
				           @click="handleSavePicture">测试保存图片</mt-button>
				<div v-for="(img,index) in imgList"
				     :key="index"
				     @click="handleViewPicture(index)">
					<img style="width:100px;height:100px"
					     :src="img"
					     alt="">
				</div>
				<mt-button type="default"
				           @click="handleScan">扫码</mt-button>
			</div>
		</div>
	</div>
</template>

<script>
import Vue from 'vue';
import customHeader from '../../components/header/header';
import jsBridge from '../../tools/jsBridge.js';
import { Button } from 'mint-ui';
export default {
	name: 'voice',
	data() {
		return {
			localUrl: '/vuepages/index.vue#/testPage2',
			suffixParams:'',
			serverUrl: 'http://10.100.36.4:9999/#/testPage2',
			imgUrl: 'http://n.sinaimg.cn/news/transform/700/w1000h500/20180627/HQDl-hencxtv2176839.jpg',
			imgList: ['http://img1.imgtn.bdimg.com/it/u=2852854259,2515271574&fm=27&gp=0.jpg', 'http://img.zcool.cn/community/0166e959ac1386a801211d25c63563.jpg@1280w_1l_2o_100sh.jpg', 'http://img.taopic.com/uploads/allimg/140714/234975-140G4155Z571.jpg'],
		};
	},
	methods: {
		handleBack() {
			jsBridge.closeWindow();
		},
		handleOpenLocalUrl() {
			jsBridge.openWindow({
				url: this.localUrl,
				target: 'local',
				suffixParams:this.suffixParams
			});
		},
		handleOpenLocalUrlTitle() {
			jsBridge.openWindow({
				url: this.localUrl,
				target: 'local',
				needTitle: true,
				suffixParams:this.suffixParams
			});
		},
		handleOpenServerUrl() {
			jsBridge.openWindow({
				url: this.serverUrl,
				target: 'server'
			});
		},
		handleOpenServerUrlTitle() {
			jsBridge.openWindow({
				url: this.serverUrl,
				target: 'server',
				needTitle: true,
				suffixParams:this.suffixParams
			});
		},
		handleTestVoiceBroadcast() {
			jsBridge.testVoiceBroadcast();
		},
		handleSavePicture() {
			jsBridge.savePicture({ url: this.imgUrl }, function(params) {
				alert("savePicture"+JSON.stringify(params));
			});
		},
		handleViewPicture(current) {
			alert(current);
			jsBridge.viewPicture({ files: this.imgList, current: current }, function(params) {
				alert("viewPicture"+JSON.stringify(params));
			});
		},
		handleScan() {
			jsBridge.scanQRCode({ type: 'bar' }, function(params) {
				alert("扫码"+JSON.stringify(params));
			});
		},
	},
	components: {
		customHeader,
	},
	mounted() {
  },
};
</script>
<style lang='scss' scoped>
@import 'testPage';
</style>
